import React from 'react';
import {Modal, Row, Col} from 'antd';
import {injectIntl} from 'react-intl';
import axios from 'axios';

class OrderDetail extends React.Component {
  constructor(props) {
    super(props);
    this.menuCheckAuth = [];
    this.orderId = this.props.orderId;
    this.discountTypes = ['星充APP大客户折扣', '星充APP用户等级折扣', '桩群折扣', '商户折扣', 'APPKEY折扣'];
    this.modalListContent = [
      {
        name: '订单号',
        key: 'id'
      },
      {
        name: '交易流水号',
        key: 'outOrderId'
      },
      {
        name: '桩编号',
        key: 'stubId'
      },
      {
        name: '充电开始时间',
        key: 'timeStart'
      },
      {
        name: '充电结束时间',
        key: 'timeEnd'
      },
      {
        name: '电量',
        key: 'power'
      },
      {
        name: '电费',
        key: 'feeElectric'
      },
      {
        name: '服务费',
        key: 'feeService'
      },
      {
        name: '总费用',
        key: 'feeTotal'
      },
      {
        name: '电压',
        key: 'voltage'
      },
      {
        name: '电流',
        key: 'current'
      },
      {
        name: 'SOC',
        key: 'soc'
      },
      {
        name: '内部问题查看说明',
        key: 'errDesc',
      },
      {
        name: '折扣类型',
        dataIndex: 'discountInfo',
        key: 'discountInfo'
      }];
      this.state = {
      roleId:'',
      options:[],
      indeterminate: true,
      checkAll: false,
      stationplainOptions: [],
      stationCheckedList: [],
      hidenStationplainOptions: [],
      modalList: [],
  }
  }

  cancel = () => {
    this.props.close();
  }

  formItemLayout = {
    labelCol: {span: 1, offset: 0},
    wrapperCol: {span: 5},
  };

  // handleCurrencyChange=(changedValue)=>{
  //   this.setState({
  //     roleId:changedValue
  //   })
  // }

  componentWillReceiveProps(nextProps) {

    if (nextProps.orderId != undefined && nextProps.orderId != '' && nextProps.orderId != null) {
      //场站权限
      axios.get('/api/cms/order/detail?id=' + nextProps.orderId).then(res => {
        if (res && res.code == 200) {
          if (res.data) {
            const [modalList, detail]= [[], res.data];
            this.modalListContent.forEach((mc) => {
              if (!detail[mc.key] && mc.key === 'discountInfo') {
                return;
              }
              modalList.push(<Col  xxl={24} xl={24} className={'modal-item'}><strong>{mc.name}: </strong><span>
                {mc.key === 'discountInfo' ? this.discountTypes[parseInt(detail[mc.key])] : detail[mc.key]}
                </span></Col>);
            });
            this.setState({
              modalList: modalList
            })
          }
        }
      });
    }
  }

  strMapToObj(strMap) {
    let obj = Object.create(null);
    for (let [k, v] of strMap) {
      obj[k] = v;
    }
    return obj;
  }

  onChangeStation = (stationCheckedList) => {
    this.setState({
      stationCheckedList,
      indeterminate: !!stationCheckedList.length && (stationCheckedList.length < this.state.stationplainOptions.length),
      checkAll: stationCheckedList.length === this.state.stationplainOptions.length,
    });
  }

  render() {
    const common = this.props.intl.messages.common;
    return (
      <Modal
        title={common.orderDetail}
        visible={this.props.visible}
        onCancel={this.cancel}
        cancelText={common.close}
        style={{width: '160%'}}
        footer={[<div key={1} style={{height: 22}}></div>]}
      >
        <Row gutter={24} type="flex">
          {
            this.state.modalList
          }
        </Row>
      </Modal>
    );
  }
}

export default injectIntl(OrderDetail);